<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>瞎溜溜~</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <meta name="description" content="这是一个很无聊很无聊的个人博客...">
    <meta name="keywords" content="前端程序员,简历,个人站,设计师,">
    <link rel="icon" href="img/icon.gif" type="image/gif">
    <meta name="author" content="MuMo">
    <link href="set/plug-in/swiper/swiper.min.css" rel="stylesheet">
    <link href="set/plug-in/swiper/animate.min.css" rel="stylesheet">
    <link href="set/style/style.css" rel="stylesheet">
</head>
<body>
<header>
    <div class="container text-center">
        <a class="logo" href="javascript:;"><img src="set/images/logo.png"></a>
        <nav><a href="#">HOME</a><a href="#">DIARY</a><a href="#">ABOUT ME</a><a href="#">LABORATORY</a></nav>
    </div>
</header>

<section class="content">
    <div class="container">
        <article class="layler-top">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <figure class="l-left ani" swiper-animate-effect="fadeInLeft">
                            <a class="imgbox" title="miku" style="background-image: url(set/images/data/tr.jpg);"
                               href="javascript:;"></a>
                        </figure>
                        <div class="l-right ani" swiper-animate-effect="fadeInLeft" swiper-animate-delay="0.2s">
                            <div class="warp">
                                <time class="time ani" swiper-animate-effect="fadeInLeft" swiper-animate-delay="0.2s">
                                    WELCOME&nbsp;-&nbsp;15/12/30
                                </time>
                                <h1 class="l-tit ani" swiper-animate-effect="fadeInRight" swiper-animate-delay="0.4s">
                                    前天是小鹿，<br>昨天是兔子，<br>今天是你...</h1>
                                <p class="ani" swiper-animate-effect="fadeInRight" swiper-animate-delay="0.6s">
                                    Hello，首先，诞生在同一银河系，身为同一物种，生存的时代相互重叠。人与人之间的邂逅，奇迹般的概率，无论是欢笑还是悲伤，或是爱恋，都是由1%的可能相聚而成，我不由得感到目眩。原来世界充满着如此多的色彩绚烂的奇迹...</p>
                            </div>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <figure class="l-left ani" swiper-animate-effect="fadeInLeft">
                            <a class="imgbox" title="miku" style="background-image: url(set/images/data/62.jpg);"
                               href="javascript:;"></a>
                        </figure>
                        <div class="l-right ani" swiper-animate-effect="fadeInLeft" swiper-animate-delay="0.2s">
                            <div class="warp">
                                <time class="time ani" swiper-animate-effect="fadeInLeft" swiper-animate-delay="0.2s">
                                    WELCOME&nbsp;-&nbsp;15/12/30
                                </time>
                                <h1 class="l-tit ani" swiper-animate-effect="fadeInRight" swiper-animate-delay="0.4s">
                                    前天是小鹿，<br>昨天是兔子，<br>今天是你...</h1>
                                <p class="ani" swiper-animate-effect="fadeInRight" swiper-animate-delay="0.6s">
                                    Hello，首先，诞生在同一银河系，身为同一物种，生存的时代相互重叠。人与人之间的邂逅，奇迹般的概率，无论是欢笑还是悲伤，或是爱恋，都是由1%的可能相聚而成，我不由得感到目眩。原来世界充满着如此多的色彩绚烂的奇迹...</p>
                            </div>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <figure class="l-left ani" swiper-animate-effect="fadeInLeft">
                            <a class="imgbox" title="miku" style="background-image: url(set/images/data/16.jpg);"
                               href="javascript:;"></a>
                        </figure>
                        <div class="l-right ani" swiper-animate-effect="fadeInLeft" swiper-animate-delay="0.2s">
                            <div class="warp">
                                <time class="time ani" swiper-animate-effect="fadeInLeft" swiper-animate-delay="0.2s">
                                    WELCOME&nbsp;-&nbsp;15/12/30
                                </time>
                                <h1 class="l-tit ani" swiper-animate-effect="fadeInRight" swiper-animate-delay="0.4s">
                                    前天是小鹿，<br>昨天是兔子，<br>今天是你...</h1>
                                <p class="ani" swiper-animate-effect="fadeInRight" swiper-animate-delay="0.6s">
                                    Hello，首先，诞生在同一银河系，身为同一物种，生存的时代相互重叠。人与人之间的邂逅，奇迹般的概率，无论是欢笑还是悲伤，或是爱恋，都是由1%的可能相聚而成，我不由得感到目眩。原来世界充满着如此多的色彩绚烂的奇迹...</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="next"></div>
            <div class="prev"></div>
        </article>

        <article class="layler-pro clearfix">
            <div class="pro">
                <div class="pro-img">
                    <a class="imgbox" style="background-image: url(set/images/data/03.jpg);" href="javascript:;"></a>
                </div>
                <div class="pro-info">
                    <p>星期天去爬山了~</p>
                    <time class="time">PHOTO&nbsp;-&nbsp;15/12/30</time>
                </div>
            </div>

            <div class="pro">
                <div class="pro-img">
                    <a class="imgbox" style="background-image: url(set/images/data/37.jpg);" href="javascript:;"></a>
                </div>
                <div class="pro-info">
                    <p>半个手镯子，一些想法...</p>
                    <time class="time">PHOTO&nbsp;-&nbsp;15/12/30</time>
                </div>
            </div>

            <div class="pro">
                <div class="pro-img">
                    <a class="imgbox" style="background-image: url(set/images/data/76.jpg);" href="javascript:;"></a>
                </div>
                <div class="pro-info">
                    <p>宅了一整年...</p>
                    <time class="time">PHOTO&nbsp;-&nbsp;15/12/30</time>
                </div>
            </div>
        </article>

    </div>
</section>

<section class="work">
    <div class="work-logo"></div>
    <div class="container">
        <div class="lor-pin clearfix">
            <div class="pin"><a href="javascript:;"><img src="set/images/test/e (1).jpg"></a></div>
            <div class="pin"><a href="javascript:;"><img src="set/images/test/e (2).jpg"></a></div>
            <div class="pin"><a href="javascript:;"><img src="set/images/test/e (3).jpg"></a></div>
            <div class="pin"><a href="javascript:;"><img src="set/images/test/e (4).jpg"></a></div>
            <div class="pin"><a href="javascript:;"><img src="set/images/test/e (9).jpg"></a></div>
            <!-- 			<div class="pin"><a href="javascript:;"><img src="set/images/test/e (6).jpg"></a></div>
                        <div class="pin"><a href="javascript:;"><img src="set/images/test/e (7).jpg"></a></div>
                        <div class="pin"><a href="javascript:;"><img src="set/images/test/e (8).jpg"></a></div> -->
        </div>
    </div>
</section>

<footer>
    <a class="gray-logo" href="javascript:;"><img src="set/images/gray-logo.png"></a>
    <dl class="dm-td">
        <dt>Momo&nbsp;
            <small>(天盖星人)</small>
        </dt>
        <dd>（—_—）拯救世界的路线越来越艰难了~</dd>
        <dd></dd>
    </dl>
    <div class="copy">Copyright © 2016 xia66.cn</div>
</footer>

<script src="set/plug-in/jquery/jquery.min.js"></script>
<script src="set/plug-in/swiper/swiper.jquery.min.js"></script>
<script src="set/plug-in/swiper/swiper.animate1.0.2.min.js"></script>
<script>
    var swiper = new Swiper('.swiper-container', {
        slidesPerView: 1,
        spaceBetween: 0,
        // autoplay: 5000,
        // effect : 'cube',
        // cube: { slideShadows: false,shadow: false},
        effect: 'fade',
        speed: 1000,
        loop: true,
        nextButton: '.next',
        prevButton: '.prev',
        onInit: function (swiper) {
            swiperAnimateCache(swiper);
            swiperAnimate(swiper);
        },
        onSlideChangeStart: function (swiper) {
            swiperAnimate(swiper);
        }
    });
</script>
</body>
</html>